<template>
	<view class="u-page">
		<div class="body-cont">
			<ul class="content" v-if="AddressList&&AddressList.length>0">
				<li class="content-address" :style="item.DefaultStatus==1?'position:relative;':''"
					v-for="(item,index) in AddressList" @click="toSelect(item)">
					<div class="moren" v-if="item.DefaultStatus==1"><span>默认</span></div>
					<div class="conlirow">
						<div class="cont-right">
							<P><span class="xmname">姓名：</span><span class="name">{{item.Name}}</span></P>
							<P><span class="xmname">电话：</span><span class="name">{{item.PhoneNum}}</span></P>
							<P><span class="xmname">地址：</span><span class="name">{{item.Region.replace(/'-'/g, '')}}-{{item.StreetVillage.replace(/'-'/g, '')}}
									{{item.Address}}</span></P>
							<p><span class="bianji" @click.stop="EditAddress(item)">编辑</span><span class="bianji"
									style="margin-left:15px; color:#737373" @click.stop="delAddress(item)">删除</span></p>
						</div>
					</div>
				</li>
				<div class="xzann" @click="addAddress">新增地址</div>
			</ul>
			<div v-else>
				<div class="item-area u-pt-50 u-pb-50" style="margin: 0 auto;">
					<u-empty text="暂无数据" mode="data"></u-empty>
				</div>
				<div class="xzann" @click="addAddress">新增地址</div>
			</div>
		</div>
		<div class="shadow" onClick="closeShadow()"></div>

		<!-- 弹窗【删除提醒】 -->
		<u-modal ref="uModal" title="系统提示" v-model="del_show" show-cancel-button confirm-text="确认" cancel-text="取消"
			@confirm="SureDEl">
			<div class="u-p-20 u-center">
				<p>您确认删除吗？</p>
			</div>
		</u-modal>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				pageNum: 1,
				pageSize: 10,
				searchStr: '',
				AddressList: [],
				del_show: false,
				Del_OrUnid: '',
				type: ''
			};
		},

		onLoad(options) {
			if (this.isNotNull(options.type)) {
				this.type = options.type
			}
		},

		onShow() {
			this.pageNum = 1
			this.getAddressList()
		},

		onPullDownRefresh() {
			this.pageNum = 1
			this.getAddressList()
		},

		onReachBottom() {
		 this.pageNum += 1
			this.getAddressList()
		},

		methods: {
			/**
			 * 获取收货地址列表
			 */
			async getAddressList() {
				const userInfo = uni.getStorageSync('userInfo')
				let result = await this.$u.api.unifyRequest({
					userId: userInfo.userId,
					nickName: userInfo.nickName,
					appid: 'Archives',
					wf_num: 'R_Archives_BL022',
					pageNum: this.pageNum,
					pageSize: this.pageSize,
					searchStr: this.searchStr,
					loading: true // 默认发起请求会有一个全局的Loading，设置false可去掉
				});
				if (result.code == 200) {
					if (this.pageNum != 1) {
						this.AddressList = this.AddressList.concat(result.data)
					} else {
						this.AddressList = result.data
					}
				}
			},

			/**
			 * 点击删除收货地址
			 */
			delAddress(item) {
				this.del_show = true
				this.Del_OrUnid = item.WF_OrUnid
			},

			/**
			 * 确认删除收货地址
			 */
			async SureDEl() {
				const userInfo = uni.getStorageSync('userInfo')
				let result = await this.$u.api.unifyRequest({
					userId: userInfo.userId,
					nickName: userInfo.nickName,
					appid: 'Archives',
					wf_num: 'R_Archives_BL023',
					OrUnid: this.Del_OrUnid,
					loading: true // 默认发起请求会有一个全局的Loading，设置false可去掉
				});
				if (result.code == 200) {
					this.showMSG('success', '删除成功')
					this.pageNum = 1
					this.getAddressList()
				} else {
					this.showMSG('error', result.msg)
				}
			},

			/**
			 * 跳转到新增地址页面
			 */
			addAddress() {
				this.$u.route('/pages_tabbar_contact/personal_contact/EditAddress');
			},

			/**
			 * 跳转到修改地址页面
			 */
			EditAddress(item) {
				this.$u.route('/pages_tabbar_contact/personal_contact/EditAddress?OrUnid=' +
					item.WF_OrUnid + '&Name=' + item.Name + '&PhoneNum=' + item.PhoneNum + '&Region=' + item.Region +
					'&StreetVillage=' + item.StreetVillage + '&Address=' + item.Address + '&DefaultStatus=' + item.DefaultStatus)
			},
			
			/**
			 * 选中地址
			 */
			toSelect(item) {
				if (this.type == 'select') {
					if(!this.isNotNull(item.Name)){
						this.$u.toast("收货人姓名不能为空！");
						return;
					} else if(!this.verificationName(item.Name)){
						this.$u.toast("收货人姓名至少包含一个字母或一个中文！");
						return;
					} else if(!this.isNotNull(item.PhoneNum)){
						this.$u.toast("手机号码不能为空！");
						return;
					} else if(!this.verificationPhone(item.PhoneNum)){
						this.$u.toast("手机号码不合法！");
						return;
					} else if(!this.isNotNull(item.Region)){
						this.$u.toast("所属地区不能为空！");
						return;
					} else if(!this.isNotNull(item.StreetVillage)){
						this.$u.toast("所属街道不能为空！");
						return;
					} else if(!this.isNotNull(item.Address)){
						this.$u.toast("详细地址不能为空！");
						return;
					} else {
						uni.$emit("AddressObj", item);
						this.goBack()
					}
				}
			},
			
		},
	};
</script>

<style scoped>
	.body-cont {
		padding-left: 18px;
		padding-right: 18px;
	}

	.content {
		padding-top: 20px;
	}

	.content-address {
		background: #F6F5F6;
		border-radius: 18px;
		padding: 16px;
		margin-bottom: 16px;
	}

	.moren {
		position: absolute;
		top: 0;
		right: 0;
		padding: 5px 25px;
		background: #e55e97;
		border-radius: 0 18px 0 18px;
	}

	.moren span {
		font-size: 12px;
		color: #FFFFFF;
		letter-spacing: 0;
		text-align: center;
		line-height: 22px;
	}

	.conlirow {
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 10px 0px;
		height: 250rpx;
	}

	.conlirow .radio {
		flex: 50px;
	}

	.radio label img {
		width: 20px;
	}

	.radio input {
		opacity: 0;
	}

	input {
		width: 80%;
		color: #000;
	}

	input {
		border: none;
		outline: none;
		font-size: 14px;
	}

	.cont-right {
		display: flex;
		flex-direction: column;
	}

	.cont-right p {
		width: 100%;
	}

	.xmname {
		opacity: 0.7;
		font-family: PingFangSC-Regular;
		font-size: 14px;
		color: #3B353C;
		line-height: 22px;
	}

	.name {
		font-family: PingFangSC-Regular;
		font-size: 14px;
		color: #3B353C;
		letter-spacing: 0;
		line-height: 22px;
	}

	.bianji {
		font-size: 14px;
		color: #e55e97;
		letter-spacing: 0;
		line-height: 22px;
	}

	.xzann {
		width: 100%;
		text-align: center;
		/* background: #5F2570; */
		background: #e55e97;
		border-radius: 9px;
		height: 40px;
		line-height: 40px;
		font-size: 18px;
		color: #FFFFFF;
	}
</style>
